<!--
 * @Date: 2023-04-16 16:45:51
 * @LastEditTime: 2023-04-24 13:56:00
 * @FilePath: /atcoin/src/components/rework/Rbutton.vue
 * 介绍:
-->
<script lang="ts" setup>
import omit from "lodash/omit";
import { ButtonNativeType } from "vant";
const slot = useSlots();
const props = withDefaults(
  defineProps<{
    bg?: string;
    type?: "primary" | "success" | "warning" | "danger" | "default";
    size?: "large" | "small" | "mini" | "normal";
    text?: string;
    icon?: string;
    iconPrefix?: string;
    iconPosition?: "left" | "right";
    tag?: keyof HTMLElementTagNameMap;
    nativeType?: ButtonNativeType;
    block?: boolean;
    plain?: boolean;
    square?: boolean;
    round?: boolean;
    disabled?: boolean;
    hairline?: boolean;
    loading?: boolean;
    loadingText?: string;
    loadingType?: "spinner" | "circular";
    loadingSize?: StrNumber;
    url?: string;
    to?: string;
    replace?: boolean;
    minWidth?: string;
  }>(),
  {
    type: "default",
    size: "normal",
  }
);
const $props = computed(() => omit(props, ["bg", "color", "minWidth"]));
</script>
<template>
  <van-button
    v-bind="$props"
    :style="{ minWidth: props.minWidth }"
    :class="{ Rbutton__notborder: props.bg }"
    :color="props.bg"
    class="Rbutton"
  >
    <slot></slot>
    <template v-if="slot.icon" #icon>
      <slot name="icon"></slot>
    </template>
    <template v-if="slot.loading" #loading>
      <slot name="loading"></slot>
    </template>
  </van-button>
</template>
<style lang="less" scoped>
.Rbutton__notborder {
  border: none;
}
</style>
